<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <script src="https://cdn.staticfile.org/vue/2.4.2/vue.min.js"></script>
</head>
<body>
<div id="#watch_test">

    单个值 ：<input type="number" v-model="text"><br>
    提示信息：<span>{{text}}</span>
    提示信息：<span>{{obj.name}}</span>
    提示信息：<span>{{obj.age}}</span>
    <br>

</div>

<script type="text/javascript">

    var vm = new Vue({
        el: '#watch_test',
        data: {
            text: '' // 该值可以是字符串、数字、布尔、数组等
        },
        mounted: {
            obj: {
                name: '456',
                age: '456'
            }
        },
        watch: {
            text(newValue, oldValue) { // 其中 newValue 是监听改变后的值，oldValue 是改变之前的值
                console.log(newValue) // 可以在此处执行对应的语句或函数
            },
            obj: {
                handler(newValue, oldValue) {
                    console.log(newValue)
                }
            }
        }
    })
</script>

</body>
</html>